import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _map from "lodash/map";
var _excluded = ["config", "onAddComponent", "onActiveComponent"];

/**
 * index
 * @date 2018/10/10
 */
import React from 'react';
import { templates } from "../utils";
import DropPage from "./Drop/DropPage";
import ComponentRender from "./ComponentRender/index";
import styles from "./index.less?modules";

var DesignerPanel = /*#__PURE__*/function (_React$Component) {
  _inherits(DesignerPanel, _React$Component);

  var _super = _createSuper(DesignerPanel);

  function DesignerPanel() {
    _classCallCheck(this, DesignerPanel);

    return _super.apply(this, arguments);
  }

  _createClass(DesignerPanel, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          _this$props$config = _this$props.config,
          config = _this$props$config === void 0 ? {} : _this$props$config,
          onAddComponent = _this$props.onAddComponent,
          onActiveComponent = _this$props.onActiveComponent,
          otherProps = _objectWithoutProperties(_this$props, _excluded);

      var components = config.fields;
      return /*#__PURE__*/React.createElement("div", {
        className: styles['drop-page']
      }, _map(components, function (component) {
        // TODO 只有在模板中的组件才能加载
        if (templates[component.templateType]) {
          return /*#__PURE__*/React.createElement(ComponentRender, Object.assign({}, otherProps, {
            onActiveComponent: onActiveComponent,
            component: component,
            key: component.renderKey
          }));
        }

        return null;
      }), /*#__PURE__*/React.createElement(DropPage, {
        key: "drop-page",
        onAddComponent: onAddComponent,
        onActiveComponent: onActiveComponent
      }));
    }
  }]);

  return DesignerPanel;
}(React.Component);

export default DesignerPanel;